import { cloneElement } from "react";

export default ({ children, render = <div /> }) => (
  <>
    {cloneElement(render, {
      children,
      className: `center-container ${render.props.className || ""}`,
    })}
    <style jsx global>
      {`
        .center-container {
          width: 100%;
          max-width: 1200px;
          margin: 0 auto;
          padding: 0 20px;
        }
      `}
    </style>
  </>
);
